/*



pagenum	是	int	页码值
pagesize	是	int	每页显示多少条数据
cate_id	否	string	文章分类的 Id
state	否	string	文章的状态，可选值有：已发布、草稿

*/
let total = 0 // 文章列表的总数

let flag = false // 定义一个标志位

const params = {
  pagenum: 1,   //页码默认是1
  pagesize: 2,  // 每页展示的数据 
  cate_id: '',  // 文章分类id
  state: ''     // 文章状态
}
// 获取文章列表数据
function getList() {
  axios({
    url: `http://api-breakingnews-web.itheima.net/my/article/list`,
    method: 'get',
    headers: { 'Authorization': localStorage.getItem('token') },
    params: params
  }).then(res => {
    // layer.msg(res.data.message)
    console.log(res);
    // 2021-09-28 10/02/50
    if (res.data.status === 0) {
      // 设置总数
      total = res.data.total

      $('tbody').empty()
      res.data.data.forEach((obj, index) => {
        let theTr = `<tr>
          <td>${obj.title}</td>
          <td>${obj.cate_name}</td>
          <td>${moment(obj.pub_date).format('YYYY-MM-DD hh:mm:ss')}</td>
          <td>${obj.state}</td>
          <th>
          <button myid="${obj.Id}" type="button" class="layui-btn layui-btn-xs layui-btn-danger del">删除</button>
              </th>
      </tr>`;
        $('tbody').append(theTr)
      });

      // 设置分页
      setPage()
    }
  })
}
getList()


// 删除事件
$('tbody').on('click','.del',function () {
  const id = $(this).attr('myid')
  // /my/article/delete/:id
  axios({
    url:`http://api-breakingnews-web.itheima.net/my/article/delete/${id}`,
    method:'get',
    headers: { 'Authorization': localStorage.getItem('token') },
  }).then(res=> {
    console.log(res);
    layer.msg(res.data.message)
    if(res.data.status === 0){
      flag = true 
      getList() // 重新渲染列表
    }
  })
})


// 设置分页控件
function setPage() {
  // 分页
  layui.use('laypage', function () {
    var laypage = layui.laypage;

    //执行一个laypage实例
    laypage.render({
      elem: 'page'
      , count: total  // 总数
      , limit: params.pagesize    // 每页的条数
      , limits: [2, 3, 5, 8, 10]    // 下拉框的选择条数
      , curr: params.pagenum   //当前页 是第一页
      , layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
      , jump: function (obj, first) {
        //obj包含了当前分页的所有参数，比如：
        console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
        console.log(obj.limit); //得到每页显示的条数
        console.log('first',first); // true

        console.log(flag); // true 
        //首次不执行
        if (!first || flag) {
          console.log('首次不执行');
          //do something

          // 修改当前的params里边的pagesize pagenum
          params.pagesize = obj.limit
          params.pagenum = obj.curr

          getList()  // 获取文章列表
          flag = false 
        }
      }
    });


  });
}


// 注册筛选事件
$('form').on('submit', function (e) {
  e.preventDefault()
  // 文章的分类
  const categoryId = $('select[name=category]').val()
  // 文章的状态
  const state = $('select[name=state]').val()
  params.cate_id = categoryId
  params.state = state

  getList() // 重新渲染列表页面

})



// 获取文章分类列表  === >筛选功能
function getCates() {
  axios({
    url: 'http://api-breakingnews-web.itheima.net/my/article/cates',
    headers: { 'Authorization': localStorage.getItem('token') },
    method: 'get',
  }).then(res => {
    if (res.data.status === 0) {
      // 默认选项- 默认获取所有分类
      $("select[name=category]").append(`<option value="" lay-verify="cate">所有分类</option>`);
      res.data.data.forEach((obj, index) => {
        const theOpt = `<option value="${obj.Id}" lay-verify="cate">${obj.name}</option>`
        $("select[name=category]").append(theOpt)
      });
      layui.form.render('select', 'category')
    }
  })
}
getCates()

